<template>
	<view :style="themeColor">
		<view class="page">
			<view class="flex benben-position-layout flex flex-wrap align-center commoDity_flex_0"
				:style="{height:(88+StatusBarRpx)+'rpx',paddingTop:StatusBarRpx+'rpx', }">
				<view class='flex flex-wrap align-center justify-between flex-sub commoDity_fd0_0'>
					<view class='flex flex-wrap align-center' @tap.stop="handleJumpDiy" data-type="back" data-url="1">
						<text class='fu-iconfont2  commoDity_fd0_0_c0_c0'>&#xE794;</text>
					</view>
					<view class='flex flex-wrap align-center'>
						<text class='commoDity_fd0_0_c1_c0'>商品详情</text>
					</view>
					<view class='flex flex-wrap align-center commoDity_fd0_0_c2'>
					</view>
				</view>

			</view>
			<view :style="{height: (88+StatusBarRpx)+'rpx'}"></view>
			<view class="loading_css" v-if="isShow">
				<u-loading size="36" color="#F35D2A"></u-loading>
				<view>加载中</view>
			</view>
			<template v-else>
				<!---轮播flex布局开始-->
				<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout commoDity_flex_1">
					<view style="position: relative">
						<swiper ref="benbenSwiperfd1_0" :current='index' @change="bannerIndexfd1_0 = $event.detail.current" class='flex position-relative commoDity_fd1_0' previous-margin="0rpx" next-margin="0rpx" :display-multiple-items="1" :interval="5000" :duration="500" :autoplay='true' :circular='true'>
							<template v-for='(item,key0) in swiperList'>
								<swiper-item class='flex  commoDity_fd1_0' :key='key0'>
									<image class='commoDity_fd1_0_c1_c0' mode="aspectFill" :src='item'></image>
								</swiper-item>
							</template>
						</swiper>
						<view style="position: absolute"
							class="flex dot flex align-center justify-center commoDity_swiperDotfd1_0">
							<view class='flex flex align-center justify-center commoDity_numberfd1_0_c0'>
								<text class='commoDity_numberfd1_0_c0_c0'>{{bannerIndexfd1_0+1}}</text>
								<text class='commoDity_numberfd1_0_c0_c0'>/</text>
								<text class='commoDity_numberfd1_0_c0_c2'>{{(swiperList.length)}}</text>
							</view>
						</view>
					</view>
					<view class='flex flex-direction flex-wrap align-stretch commoDity_fd1_1'>
						<view class='flex flex-wrap align-center commoDity_fd1_1_c1'>
							<text class='commoDity_fd1_1_c1_c0'>{{dataDetails.score}}</text>
							<text class='commoDity_fd1_1_c1_c1'>积分</text>
							<!-- <text class='commoDity_fd1_1_c1_c1_1' v-if="dataDetails.score=='0.00'">积分</text> -->
							<!-- <text class='commoDity_fd1_1_c1_c2'>￥</text>
							<text class=' commoDity_fd1_1_c1_c3'>
								<text class=' commoDity_price1_fd1_1_c1_c3'>{{ dataDetails.shop_price | frontPrice }}</text>
								<text class=' commoDity_price2_fd1_1_c1_c3'>{{ dataDetails.shop_price | laterPrice }}</text>
							</text> -->
						</view>
						<view style="padding: 0 32rpx;">
							<view class='commoDity_fd1_1_c0'>{{dataDetails.goods_name}}</view>
						</view>
						
					</view>
					<view class='flex flex-direction flex-wrap align-stretch commoDity_fd1_2'>
						<view v-if="dataDetails.is_open_sku" class='flex flex-wrap align-center commoDity_fd1_2_c0'
							@click="openSpec">
							<text class='commoDity_fd1_2_c0_c0'>规格</text>
							<input class='commoDity_fd1_2_c0_c1' type="text" :placeholder="`请选择规格`" confirm-type="done" :maxlength="-1" placeholder-style="color:#bfbfbf;font-size:24rpx" disabled v-model="classification.spec_item_name" />
							<image class='commoDity_fd1_2_c0_c2' mode="aspectFill" :src='STATIC_URL+"594.png"'></image>
						</view>
						<!-- <view class='flex flex-wrap align-center commoDity_fd1_2_c1'>
							<text class='commoDity_fd1_2_c0_c0'>运费</text>
							<text class='commoDity_fd1_2_c1_c1'>{{dataDetails.freight_fee}}</text>
						</view> -->
						<view v-if="goodData.is_open_sku == 0" class='flex flex-wrap align-center justify-between'
							style="padding-bottom: 32rpx;">
							<text class='commoDity_fd1_2_c0_c0'>数量</text>
							<view class="flex align-center justify-center flex-direction merchanDisedetails_fd2_3_c1_c1">
								<uni-number-box v-if="goodData.max_buy_num" v-model="buyNum" :min="1" :step="1"
									:max="goodData.max_buy_num"></uni-number-box>
								<uni-number-box v-else :min="1" :step="1" v-model="buyNum"></uni-number-box>
							</view>
						</view>
					</view>
					<view class='flex flex-direction flex-wrap align-stretch commoDity_fd1_3'>
						<view class='flex align-center' style="margin-bottom: 32rpx;">
							<image class="tips_icon" :src='STATIC_URL+"604.png"' mode="aspectFill"></image>
							<text class='commoDity_fd1_3_c0_c0'>商品详情</text>
						</view>
						<view class='flex flex-wrap align-center'>
							<jyf-parser :html="dataDetails.body" class='commoDity_fd1_3_c1_c0'>
							</jyf-parser>
						</view>
						<view v-if="!pageLoading" class='flex flex-wrap align-center justify-center commoDity_fd1_3_c2'>
							<button class='commoDity_fd1_3_c2_c0' @tap.stop="toBuyGood()" v-if="userDetails.score>=dataDetails.score">立即兑换</button>
							<button class='commoDity_fd1_3_c2_c0_1' v-else>积分不足(当前积分：{{userDetails.score}})</button>
						</view>
					</view>
				</view>
			</template>
			
			<!---轮播flex布局结束-->
		</view>
		
		<view style="height: 80rpx;"></view>

		<!---规格flex布局结束-->
		<benben-popup v-model="popupShow1653961165769" :mask="true" mode='bottom'>
			<!---规格弹窗flex布局开始-->
			<view class="flex flex-direction flex-wrap align-stretch benben-flex-layout commoDity_flex_6">
				<view class='flex flex-direction flex-wrap align-stretch commoDity_fd6_0'>
					<view class='flex flex-wrap align-center commoDity_fd6_0_c0'>
						<image class='commoDity_fd6_0_c0_c0' mode="aspectFill" :src='classification.sku_img'></image>
						<view class='flex flex-wrap align-center flex-sub'>
							<view class='flex flex-direction flex-wrap align-stretch flex-sub'>
								<view class='flex flex-wrap ' style="margin-bottom: 16rpx;;align-items: baseline;">
									<text class='commoDity_fd6_0_c0_c1_c0_c0_c0'>{{classification.score}}</text>
									<text class='commoDity_fd6_0_c0_c1_c0_c0_c0_1'>积分</text>
								</view>
								<view style="display: flex;color: #999;">
									<view class='flex flex-wrap align-center commoDity_fd6_0_c0_c1_c0_c1'>
										<text class='commoDity_fd6_0_c0_c1_c0_c1_c0'>库存：</text>
										<text class='commoDity_fd6_0_c0_c1_c0_c1_c1'>{{classification.stock}}</text>
									</view>
									<view class='flex flex-wrap align-center' style="margin-left: 40rpx;">
										<text class='commoDity_fd6_0_c0_c1_c0_c2_c0'>已选：</text>
										<text
											class='commoDity_fd6_0_c0_c1_c0_c2_c1'>{{classification.spec_item_name}}</text>
									</view>
								</view>
							</view>
							<view class="close-box">
								<text class="cuIcon-close" @tap="popupShow1653961165769=false"></text>
							</view>
						</view>
					</view>
					<view class='flex flex-direction flex-wrap align-stretch commoDity_fd6_0_c1'
						v-for="(v, k) in goodData.goods_spec" :key="k">
						<text class='commoDity_fd6_0_c1_c0'>{{v.name}}</text>
						<view>
							<view class='flex align-center justify-center flex commoDity_fd6_0_c1_c1_c1'
								:class="item.isSelect ? 'is_select' : ''" v-for='(item,key) in v.child' :key="key">
								<text class="commoDity_fd6_0_c1_c1_c1_c0" @tap="selectSpec(k, key)">{{item.item}}</text>
							</view>
						</view>
					</view>
					<view class='flex  align-start commoDity_fd6_0_c3'>
						<text class='commoDity_fd6_0_c3_c0'>购买数量</text>

						<view class="flex align-center justify-center" style="flex-direction: column;">
							<uni-number-box v-if="goodData.max_buy_num" v-model="buyNum" :min="1" :step="1"
								:max="goodData.max_buy_num"></uni-number-box>
							<uni-number-box v-else :min="1" :step="1" v-model="buyNum"></uni-number-box>
							<view v-if="goodData.max_buy_num-0"
								style="padding: 24rpx;margin:0 0 0 auto;width:max-content;color:#62889B;">
								此商品限购{{goodData.max_buy_num}}件</view>
						</view>
					</view>

					<view style="height: 12rpx;"></view>
					<button class='commoDity_fd6_0_c4' v-if="dataDetails.score>=classification.score" @click="toBuyGood">立即兑换</button>
					<button class='commoDity_fd6_0_c5' v-else>积分不足(当前积分：{{dataDetails.score}})</button>
				</view>
			</view>
			<!---规格弹窗flex布局结束-->
		</benben-popup>
	</view>
</template>
<script>
	import {
		validate
	} from '@/common/utils/validate.js'
	import {
		selectSkuMixin
	} from './selectSkuMixin.js';
	import {
		formMixin
	} from './formMixin'
	export default {
		components: {},
		mixins: [selectSkuMixin, formMixin, ],
		data() {
			return {
				"bannerIndexfd1_0": 0,
				"coupon": "0",
				"integral": "500",
				"sorts": [{
					"name": "精粹液",
					"value": "1",
					"image": ""
				}, {
					"name": "面霜",
					"value": "2",
					"image": ""
				}],
				"sor": "1",
				"milliliter": [{
						"name": "xxx.shop_priceml",
						"value": "1",
						"image": ""
					}, {
						"name": "150ml",
						"value": "2",
						"image": ""
					}, {
						"name": "200ml",
						"value": "3",
						"image": ""
					},
					{
						"name": "300ml",
						"value": "4",
						"image": ""
					}
				],
				"ml": "1",
				"dataDetails": {},
				"index": 1,
				"address_id": "",
				"dataAddress": [],
				"commodity_id": "8",
				"id": "346",
				pageLoading: true,
				dataDetails: {
					score: 0
				},
				swiperList: [],
				isShow: true,
				userDetails: {},
			};
		},
		computed: {
			themeColor() {
				return this.$store.getters.themeColor
			},
			isLogin() {
				return this.$store.state.token == '' ? false : true;
			},
			userInfo: {
				get() {
					return this.$store.state.userInfo
				},
				set() {
					this.$store.commit('updateUserInfo', value)
				},
			},
		},
		watch: {},
		onLoad(options) {
			let {
				commodity_id,
				id
			} = options
			if (commodity_id !== undefined) this.commodity_id = commodity_id
			if (id !== undefined) this.id = id
			this.getDetailFunc()
			this.getAddressFunc()
			this.getUserinfoFunc();
		},
		onUnload() {

		},
		onReady() {

		},
		onShow() {

		},
		onHide() {

		},
		onResize() {

		},
		onPullDownRefresh() {

		},
		onReachBottom(e) {

		},
		onPageScroll(e) {

		},
		methods: {
			//积分商城-积分商品详情
			async getDetailFunc() {
				//请求方法
				//数据验证

				let datadataDetails = await this.$api.post(`/${this.apiFix}/6555fe7c89f4e`, {
					goods_id: this.id,
					user_id: this.userInfo.id
				});
				this.isShow = false;
				this.pageLoading = false;
				if (datadataDetails.data.code != 1) {
					this.$message.info(datadataDetails.data.msg);
					return
				}
				let infodataDetails = datadataDetails.data;
				this.dataDetails = infodataDetails.data;
				this.swiperList = this.dataDetails.images;
				this.setSkuList(this.dataDetails);
			},
			//获取默认地址
			async getAddressFunc() {
				let datadataAddress = await this.$api.post(`/${this.apiFix}/6544d0c0718a8`, {
				
				});
				
				if (datadataAddress.data.code != 1) {
					this.$message.info(datadataAddress.data.msg);
					return
				}
				let infodataAddress = datadataAddress.data.data;
				if (infodataAddress.length > 0) {
					const _info = infodataAddress.find(item => item.is_default);
					this.addressInfo = _info || infodataAddress[0];
				}
			},
			//获取个人信息
			async getUserinfoFunc() {
				let datadataDetails = await this.$api.post(`/${this.apiFix}/5c78c4772da97`,{
				
				});
				
				if (datadataDetails.data.code != 1) {
					this.$message.info(datadataDetails.data.msg);
					return
				}
				let infodataDetails = datadataDetails.data;
				this.userDetails = infodataDetails.data
			},
		}
	};
</script>
<style lang="scss" scoped>
	.tips_icon {
		width: 7rpx;
		height: 30rpx;
		margin-right: 16rpx;
	}
	.page {
		width: 100vw;
		overflow-x: hidden;
		min-height: calc(100vh - var(--window-bottom));
		background: #f8f8f8;
		background-size: 100% auto;
	}

	.commoDity_flex_0 {
		background: #fff;
		width: 750rpx;
		height: 88rpx;
		overflow: hidden;
		z-index: 10;
		top: 0rpx;
		background-size: 100% auto !important;
	}

	.commoDity_fd0_0_c2 {
		width: 36rpx;
	}

	.commoDity_fd0_0_c1_c0 {
		font-size: 36rpx;
		font-weight: 500;
		color: #333333;
	}

	.commoDity_fd0_0_c0_c0 {
		font-size: 36rpx;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
	}

	.commoDity_fd0_0 {
		margin: 0rpx 32rpx 0rpx 32rpx;
		line-height: 88rpx;
	}

	.commoDity_flex_1 {
		// padding: 0rpx 0rpx 32rpx 0rpx;
		position: relative;
	}

	.commoDity_fd1_3_c2_c0_1 {
		background: #DBDBDB;
		font-size: 32rpx;
		color: #666;
		width: 100%;
		height: 109rpx;
		line-height: 109rpx;
		font-weight: 400;
		border-radius: 0;
	}

	.commoDity_fd1_3_c2_c0 {
		background: #F35D2A;
		font-size: 32rpx;
		color: #fff;
		width: 100%;
		height: 109rpx;
		line-height: 109rpx;
		font-weight: 400;
		border-radius: 0;
	}

	.commoDity_fd1_3_c2 {
		position: fixed;
		left: 0rpx;
		bottom: calc(0rpx + var(--window-bottom));
		width: 750rpx;
		height: 109rpx;
		display: flex;
		align-items: center;
		justify-content: center;
		z-index: 9;
	}

	::v-deep .commoDity_fd1_3_c1_c0 {
		width: 100%;
	}

	.commoDity_fd1_3_c0_c0 {
		font-size: 36rpx;
		font-weight: 500;
		color: #333333;
	}

	.commoDity_fd1_3 {
		background: #FFFFFF;
		padding: 32rpx;
		margin: 20rpx 0 0;
	}

	.commoDity_fd1_2_c1_c1 {
		font-size: 30rpx;
		font-weight: 400;
		color: #666666;
		margin: 0rpx 0rpx 0rpx auto;
	}

	.commoDity_fd1_2_c1 {
		padding: 32rpx 0rpx 32rpx 0rpx;
		margin: 0rpx 0rpx 0rpx 0rpx;
	}

	.commoDity_fd1_2_c0_c2 {
		width: 20rpx;
		height: 20rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.commoDity_fd1_2_c0_c1 {
		text-align: right;
		margin: 0rpx 12rpx 0rpx auto;
		font-size: 24rpx;
	}

	.commoDity_fd1_2_c0_c0 {
		font-size: 28rpx;
		font-weight: 500;
		color: #666;
	}

	.commoDity_fd1_2_c0 {
	}

	.commoDity_fd1_2 {
		background: #FFFFFF;
		padding: 32rpx;
	}

	.commoDity_price2_fd1_1_c1_c3 {
		font-size: 22rpx;
	}

	.commoDity_price1_fd1_1_c1_c3 {
		font-size: 32rpx;
	}

	.commoDity_fd1_1_c1_c3 {
		color: rgba(153, 153, 153, 1);
		font-weight: 600;
	}

	.commoDity_fd1_1_c1_c2 {
		color: #999999;
		font-size: 20rpx;
		font-weight: 500;
		margin: 0rpx 0rpx 0rpx 10rpx;
	}

	.commoDity_fd1_1_c1_c1_1 {
		font-size: 22rpx;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		line-height: 28rpx;
	}

	.commoDity_fd1_1_c1_c1 {
		font-size: 20rpx;
		font-weight: 700;
		color: #fff;
		margin: 0rpx 0rpx 0rpx 4rpx;
	}

	.commoDity_fd1_1_c1_c0 {
		font-size: 44rpx;
		font-weight: bold;
		color: #fff;
	}

	.commoDity_fd1_1_c1 {
		background: url(https://yongzhixing.niurenjianzhan.com/uploads/mini/487.png) no-repeat;
		background-size: 100% 100%;
		height: 90rpx;
		padding: 0 32rpx;
	}

	.commoDity_fd1_1_c0 {
		// -webkit-line-clamp: 2;
		// overflow: hidden;
		// text-overflow: ellipsis;
		// display: -webkit-box;
		// -webkit-box-orient: vertical;
		font-size: 32rpx;
		font-weight: 500;
		color: #333333;
		padding: 32rpx 0;
		border-bottom: 1rpx solid #eee;
		
	}

	.commoDity_fd1_1 {
		background: #FFFFFF;
		// padding: 32rpx;
	}

	.commoDity_numberfd1_0_c0_c2 {
		font-size: 26rpx;
		color: rgba(255, 255, 255, 1);
		font-weight: 400;
	}

	.commoDity_numberfd1_0_c0_c0 {
		font-size: 32rpx;
		color: #FFFFFF;
		font-weight: 400;
	}

	.commoDity_numberfd1_0_c0 {
		background: #000000;
		position: absolute;
		bottom: 24rpx;
		right: 32rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		opacity: 0.5;
		padding: 5rpx 20rpx 5rpx 20rpx;
		width: 126rpx;
	}

	.commoDity_fd1_0_c1_c0 {
		width: 750rpx;
		height: 750rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.commoDity_fd1_0 {
		width: 750rpx;
		height: 750rpx;
	}

	.commoDity_swiperDotUnselectedfd1_0 {
		border: 1px solid rgba(0, 0, 0, 0.3);
		background: rgba(0, 0, 0, 0.3);
		width: 16rpx;
		height: 16rpx;
		border-radius: 100rpx 100rpx 100rpx 100rpx;
		margin: 0rpx 6rpx 0rpx 0rpx;
		font-size: 24rpx;
		color: #fff;
	}

	.commoDity_swiperDotSelectedfd1_0 {
		border: 1px solid #00A7FF;
		background: #00A7FF;
		width: 16rpx;
		height: 16rpx;
		border-radius: 100rpx 100rpx 100rpx 100rpx;
		margin: 0rpx 6rpx 0rpx 0rpx;
		font-size: 24rpx;
		color: #fff;
	}

	::v-deep .commoDity_swiperDotfd1_0 {
		position: absolute;
		bottom: 20rpx;
		left: 0rpx;
		right: 0rpx;
	}

	/* ——————————————————————————————sku—————————————————————————————————————————— */
	.commoDity_flex_6 {
		border-radius: 24rpx 24rpx 0rpx 0rpx;
		padding: 100rpx 0rpx 0rpx 0rpx;
	}


	.commoDity_fd6_0 {
		background: #fff;
		background-size: 100% !important;
		background-size: 100% auto !important;
		border-radius: 24rpx 24rpx 0rpx 0rpx;
		max-height: 1000rpx;
	}

	.commoDity_fd6_0_c0 {
		margin: 30rpx 32rpx 0rpx 32rpx;
	}

	.commoDity_fd6_0_c0_c0 {
		width: 200rpx;
		height: 200rpx;
		border-radius: 16rpx 16rpx 16rpx 16rpx;
		margin: -66rpx 24rpx 0rpx 0rpx;
	}

	.commoDity_fd6_0_c0_c1_c0_c0_c0 {
		font-size: 42rpx;
		font-weight: 700;
		color: #333333;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c0_c1_c0_c0_c0_1 {
		font-size: 26rpx;
		font-weight: 700;
		color: #333;
		margin: 0rpx;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c0_c1_c0_c0_c1 {
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		font-size: 22rpx;
		line-height: 28rpx;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c0_c1_c0_c1 {
		margin: 0rpx 0rpx 8rpx 0rpx;
		transform: translateY(4rpx);
	}

	.commoDity_fd6_0_c0_c1_c0_c1_c0 {
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c0_c1_c0_c1_c1 {
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c0_c1_c0_c2_c0 {
		word-wrap: break-word;
		font-size: 24rpx;
	}

	.commoDity_fd6_0_c0_c1_c0_c2_c1 {
		word-wrap: break-word;
		font-size: 24rpx;
	}

	.commoDity_fd6_0_c0_c1_c0_c2_c2 {
		word-wrap: break-word;
		font-size: 24rpx;
	}

	.commoDity_fd6_0_c0_c1_c1 {
		width: 28rpx;
		height: 28rpx;
		border-radius: 0rpx 0rpx 0rpx 0rpx;
	}

	.commoDity_fd6_0_c1 {
		margin: 32rpx 32rpx 0rpx 32rpx;
	}

	.commoDity_fd6_0_c1_c0 {
		font-size: 28rpx;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		margin: 0rpx 0rpx 24rpx 0rpx;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c1_c1_c0 {
		border: 1px solid #AD3823;
		background: #FFFFFF;
		background-size: 100% !important;
		width: 144rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		margin: 0rpx 24rpx 24rpx 0rpx;
	}

	.commoDity_fd6_0_c1_c1_c0_c0 {
		font-size: 28rpx;
		font-weight: 500;
		color: #AD3823;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c1_c1_c1 {
		background: #F5F5F5;
		background-size: 100% !important;
		width: 144rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		margin: 0rpx 24rpx 24rpx 0rpx;
		float: left;
		color: #333;
		font-size: 28rpx;
	}

	.is_select {
		border: 1px solid #F35D2A;
		background: rgba(243,93,42,0.1);
		background-size: 100% !important;
		width: 144rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		margin: 0rpx 24rpx 24rpx 0rpx;
		float: left;
		color: #F35D2A !important;
		font-size: 28rpx;
	}

	.commoDity_fd6_0_c1_c1_c1_c0 {
		font-size: 28rpx;
		font-weight: 400;
		// color: rgba(51, 51, 51, 1);
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c2 {
		margin: 24rpx 32rpx 0rpx 32rpx;
	}

	.commoDity_fd6_0_c2_c0 {
		font-size: 32rpx;
		font-weight: 500;
		color: rgba(51, 51, 51, 1);
		margin: 0rpx 0rpx 24rpx 0rpx;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c2_c1_c0 {
		border: 1px solid #AD3823;
		background: #FFFFFF;
		background-size: 100% !important;
		width: 144rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		margin: 0rpx 24rpx 24rpx 0rpx;
	}

	.commoDity_fd6_0_c2_c1_c0_c0 {
		font-size: 28rpx;
		font-weight: 500;
		color: #AD3823;
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c2_c1_c1 {
		border: 1px solid #BFBFBF;
		background: #FFFFFF;
		background-size: 100% !important;
		width: 144rpx;
		height: 64rpx;
		border-radius: 32rpx 32rpx 32rpx 32rpx;
		margin: 0rpx 24rpx 24rpx 0rpx;
	}

	.commoDity_fd6_0_c2_c1_c1_c0 {
		font-size: 28rpx;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		word-wrap: break-word;
	}

	.commoDity_fd6_0_c3 {
		margin: 30rpx 32rpx 30rpx 32rpx;
	}

	.commoDity_fd6_0_c3_c0 {
		margin: 0rpx auto 0rpx 0rpx;
		font-size: 28rpx;
		font-weight: 400;
		color: rgba(51, 51, 51, 1);
		word-wrap: break-word;
	}

	::v-deep .commoDity_numberBoxInputfd6_0_c3_c1 {
		border: 1px solid #DCDCDC;
		background: #fff;
		background-size: 100% !important;
		width: 74rpx;
		height: 50rpx;
		text-align: center;
		color: #323232;
		font-size: 28rpx;
	}

	.commoDity_fd6_0_c3_c1_c0 {
		height: 50rpx;
		width: 52rpx;
		transform: translateY(5rpx);
	}

	.commoDity_fd6_0_c3_c1_c2 {
		height: 50rpx;
		width: 52rpx;
		transform: translateY(5rpx);
	}

	.commoDity_fd6_0_c4 {
		background: #F35D2A;
		background-size: 100% !important;
		border-radius: 40rpx;
		font-size: 32rpx;
		color: #fff;
		width: 686rpx;
		height: 80rpx;
		line-height: 80rpx;
		font-weight: 500;
		margin: 0 32rpx 32rpx;
	}
	.commoDity_fd6_0_c5 {
		background: #f5f5f5;
		background-size: 100% !important;
		border-radius: 40rpx;
		font-size: 32rpx;
		color: #999;
		width: 686rpx;
		height: 80rpx;
		line-height: 80rpx;
		font-weight: 500;
		margin: 0 32rpx 32rpx;
	}

	.close-box {
		width: 40rpx;
		height: 40rpx;
		border-radius: 50%;
		background-color: rgba(0, 0, 0, 0.1);
		display: flex;
		align-items: center;
		justify-content: center;
		color: #999999;
		font-size: 28rpx;
		font-weight: bold;
		margin: 0 0 auto 0;
	}

	::v-deep .uni-numbox__minus,
	::v-deep .uni-numbox__plus {
		background-color: transparent !important;
	}

	::v-deep .uni-numbox__value {
		background-color: #F7F7F7;
	}
</style>